<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <style>
        /* 为了避免Internet Explorer 中无法调整文本的问题，许多开发者使用 em 单位代替像素。 */
        /* em的尺寸单位由W3C建议。 */
        /* 1em和当前字体大小相等。在浏览器中默认的文字大小是16px。 */
        /* 因此，1em的默认大小是16px。可以通过下面这个公式将像素转换为em：px/16=em */

        /* 40px/16=2.5em */
        h1 {
            font-size: 2.5em;
        }

        /* 30px/16=1.875em */
        h2 {
            font-size: 1.875em;
        }

        /* 14px/16=0.875em */
        p {
            font-size: 0.875em;
        }
    </style>
</head>

<body>

    <h1>This is heading 1</h1>
    <h2>This is heading 2</h2>
    <p>This is a paragraph.</p>
    <p>使用 em 单位，允许在所有浏览器中调整文本大小。
        不幸的是，仍然是IE浏览器的问题。调整文本的大小时，会比正常的尺寸更大或更小。
    </p>
</body>

</html>